<template>
  <div :style="[{paddingTop:!$store.state.isDDMobilePlatform?'46px':'0px'}]" class="container-big">
    <div class="van_nav_bar_box">
      <van-nav-bar @click-left="$goBack()" class="maxWidth cursor" @click-right="navBarRight()" v-if="!$store.state.isDDMobilePlatform" :title="$store.state.navBarTitle" :left-text="isShowBottomNav?'':'返回'" :right-text="$store.state.navBarRight.title" :left-arrow="!isShowBottomNav" />
    </div>
    <!-- style="padding-bottom:300px" 部分系统有问题 -->
    <div class="container">
      <router-view />
      <!-- 底部导航 -->
      <bottomNav v-if="isShowBottomNav" />
    </div>
  </div>
</template>
<script>
import bottomNav from "@/components/bottomNav";
export default {
  components: { bottomNav },
  // 监听,当路由发生变化的时候执行
  watch: {
    $route: {
      handler(val, oldVal) {
        const isShowBottomNavPath = ["/myApprove", "/assessment", "/score"]; //可以展示底部导航的页面path
        if (isShowBottomNavPath.indexOf(val.path) != -1) {
          this.isShowBottomNav = true;
        } else {
          this.isShowBottomNav = false;
        }

        // 解决回退问题
        if (sessionStorage.getItem("isOpnePage") && val.path == "/") {
          this.$ddApi.close();
        }
      },
      // 深度观察监听
      deep: true
    }
  },
  data() {
    return {
      isShowBottomNav: true //是否展示底部导航栏
    };
  },
  methods: {
    // 头部右侧方法
    navBarRight() {
      this.$store.state.navBarRight.callBackFun();
    }
  }
};
</script>

<style scoped>
.van_nav_bar_box {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: auto;
  z-index: 999;
}
</style>